{% extends "base.html" %}

{% block title %}429 - 访问速度过快{% endblock %}

{% block content %}
<div class="container mt-5">
    <div class="row">
        <div class="col-md-8 offset-md-2">
            <div class="card">
                <div class="card-header bg-danger text-white">
                    <h4 class="mb-0">请求频率过快</h4>
                </div>
                <div class="card-body">
                    <h5>操作受限</h5>
                    <p>{{ error.message }}</p>
                    
                    {% if error.remaining_time > 0 %}
                    <div class="mb-3">
                        <p>自动解除限制倒计时: <span id="countdown">{{ error.remaining_time }}</span> 秒</p>
                    </div>
                    {% endif %}
                    
                    <div class="mt-4">
                        <h5>人机验证</h5>
                        <p>输入下方验证码可立即解除限制:</p>
                        
                        <form method="POST" action="{{ url_for('user.verify_human') }}">
                            <input type="hidden" id="csrf_token" name="csrf_token" value="{{ csrf_token }}">
                            <input type="hidden" name="next" value="{{ next_url }}">
                            
                            <div class="row g-3 align-items-center mb-3">
                                <div class="col-auto">
                                    <label for="captcha" class="col-form-label">验证码:</label>
                                </div>
                                <div class="col-auto">
                                    <input type="text" id="captcha" name="captcha" class="form-control" required>
                                </div>
                                <div class="col-auto">
                                    <span class="form-text text-primary fw-bold fs-4">{{ captcha }}</span>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <button type="submit" class="btn btn-primary">验证</button>
                            </div>
                        </form>
                    </div>
                    
                    <hr>
                    <div class="mt-3">
                        <a href="javascript:history.back()" class="btn btn-outline-secondary me-2">返回上一页</a>
                        <a href="{{ url_for('user.login') }}" class="btn btn-outline-primary">返回登录页</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
// 倒计时功能
document.addEventListener('DOMContentLoaded', function() {
    const countdownEl = document.getElementById('countdown');
    if (countdownEl) {
        let seconds = parseInt(countdownEl.textContent, 10);
        
        const countdownTimer = setInterval(function() {
            seconds--;
            countdownEl.textContent = seconds;
            
            if (seconds <= 0) {
                clearInterval(countdownTimer);
                // 自动刷新页面
                location.href = "{{ next_url }}";
            }
        }, 1000);
    }
});
</script>
{% endblock %}
